<template>
  <uni-nav-bar :title="title" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar right-icon="plusempty"
    @clickRight="clickRight"></uni-nav-bar>
  <view class="package space-between" v-if="shopInfor">
    <image :src="shopInfor.goods_image" mode="" style="width: 210rpx;height: 210rpx;border-radius: 5px;"></image>
    <view class="direction-start" style="width:66%;height: 210rpx;">
      <view class="title">{{shopInfor.name}}</view>
      <view style="font-size: 28rpx;margin-top: 15rpx;">库存:{{shopInfor.nums}}件</view>
      <view style="font-size: 26rpx;margin-top: 15rpx;color:#666;" v-if="shopInfor.subtitle">{{shopInfor.subtitle}}
      </view>
    </view>
  </view>
  <scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box"
    :style="{ height: pageHeight + 'px' }">
    <view class="package" v-for="(item,index) in frinedList" :key="item.id" :style="{marginTop:index==0?'0px':'15rpx'}">
      <view class="space-between">
        <view style="width:85%;">{{item.memo}}</view>
        <view>{{item.nums}}</view>
      </view>
      <view class="space-between top" style="font-size: 26rpx;">
        <view>{{item.createtime}}</view>
        <view>变动后：{{item.after}}</view>
      </view>
    </view>
    <Popu v-if="frinedList.length<1" :pageHeight="pageHeight" text="暂无商品列表"></Popu>
  </scroll-view>
  <!-- 调库弹框 -->
  <uni-popup ref="store" type="center">
    <view class="package" style="width: 600rpx;">
      <uni-segmented-control :current="current" :values="items" style-type="button" active-color='#007aff'
        @clickItem="onClickItem" />
      <view class="space-between" style="margin-top:30rpx;">
        <view>数量</view>
        <input class="uni-input" placeholder="请填写数量" v-model="nums" />
      </view>
      <view class="space-between top" v-if="current===0">
        <view>仓库</view>
        <hpy-form-select :dataList="storeList" text="name" name="value" @change="consolu" :Text="storeName"
          :icon="true" />
      </view>
      <view class="space-between top">
        <view>备注</view>
        <input class="uni-input" placeholder="请填写备注" v-model="remark" />
      </view>
      <view class="sure" @click="submit()">确认</view>
    </view>
  </uni-popup>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { navBack } from '@/utils/navigator';
  import { showLoading, errorToast, successToast } from '@/utils/prompt';
  import { onLoad } from '@dcloudio/uni-app';
  import Popu from '@c/earthPushing/common/popu.vue';
  import { getKuGoodsChangeList, getKuGoodsInfo, getKuData } from '@/gql/warehouse';
  import { toPublish } from '@mqtt';
  import { getDriverID } from '@/stores/driverID';
  /**
   * 商品变动信息列表
   * @param admin_id 用户ID
   * @param items 仓库可操控的选项
   * @param current 选项索引-
   * @param store 调库弹框
   * @param storeList 库存列表
   * @param storeName 库存名称
   * @param storeId 库存ID
   * @param title 页面标题
   * @param nums 调整库存数量
   * @param remark 调整库存备注信息
   * @param wareID 仓库ID
   * @param shopID 商品ID
   * @param shopInfor 当前商品详情
   * @param wareID 仓库ID
   * @param pageHeight 页面高度
   * @param frinedList 商品变动列表
   * @param lastPage 总页数
   * @param currentPage 当前页数
   */
  const admin_id = getDriverID();//用户ID
  const items = ['移库', '入库', '盘亏']
  const current = ref(0)
  const store = ref(null)
  const storeList = ref([]); // 库存列表
  const storeName = ref(''); //库存名称
  const storeId = ref();//库存ID
  const title = ref()
  const nums = ref()
  const remark = ref()

  const wareID = ref() //仓库ID
  const shopID = ref() //商品ID
  const shopInfor = ref()

  const pageHeight = ref();
  const frinedList = ref([])
  const lastPage = ref(1);
  const currentPage = ref(1);
  uni.getSystemInfo({
    success: function (res) {
      pageHeight.value = res.windowHeight - 210;
    },
  });
  onLoad((pearm) => {
    wareID.value = Number(pearm.wareID)
    shopID.value = Number(pearm.shopID)
    init()
    shopDetail()
  })
  //商品详情
  function shopDetail() {
    showLoading()
    const payload = {
      query: getKuGoodsInfo,
      variables: {
        id: Number(shopID.value)
      },
    };
    toPublish(
      'ql/control/getKuGoodsInfo',
      payload,
      (obj : any) => {
        const { getKuGoodsInfo } = obj.data;
        shopInfor.value = getKuGoodsInfo
        title.value = getKuGoodsInfo.name
      }
    );
  }
  /**
   * 获取商品信息
   * @param {Number} page  获取商品列表数据
   * @param {String} keywords  搜索信息
   */
  function init() {
    showLoading()
    const payload = {
      query: getKuGoodsChangeList,
      variables: {
        page: currentPage.value,
        id: Number(shopID.value)
      },
    };
    toPublish(
      'ql/control/getKuGoodsChangeList',
      payload,
      (obj : any) => {
        const { getKuGoodsChangeList } = obj.data;
        frinedList.value = [...frinedList.value, ...getKuGoodsChangeList.list];
        lastPage.value = getKuGoodsChangeList.lastpage;
      }
    );
  }
  /**
   * 加载更多
   */
  function loadMore() {
    if (currentPage.value < lastPage.value) {
      currentPage.value++;
      init();
    }
  }
  /**
   * 获取仓库列表
   */
  wareList()
  function wareList() {
    showLoading()
    const payload = {
      query: getKuData
    };
    toPublish(
      'ql/control/getKuData',
      payload,
      (obj : any) => {
        const { getKuData } = obj.data;
        storeList.value = getKuData
      }
    );
  }
  /**
   * 打开调整仓库弹框
   */
  function clickRight() {
    store.value.open()
  }
  //切换库存列表
  function consolu(e : any) {
    storeName.value = e.data.name;
    storeId.value = e.data.id;
  }
  /**
   * @param {Object} e 调整仓库当前选择状态
   */
  function onClickItem(e : any) {
    if (current.value !== e.currentIndex) {
      current.value = e.currentIndex
    }
  }
  /**
   * 提交仓库操作信息
   * @param {Number} current.value  0'移库', 1'入库', 2'盘亏'
   */
  function submit() {
    showLoading()
    if (!storeId.value && current.value === 0) {
      errorToast('请选择您要移库的仓库')
      return
    }
    const payload = {
      id: Number(shopID.value),
      nums: nums.value,
      admin_id,
      remark: remark.value,
      ku_id: Number(storeId.value)
    };
    switch (current.value) {
      case 0:
        toPublish('control/moveKu',
          payload,
          Relocation
        );
        break;
      case 1:
        toPublish('control/inKu',
          payload,
          Relocation
        );
        break;
      case 2:
        toPublish('control/panKu',
          payload,
          Relocation
        );
        break;
    }
  }
  /**
   * 清空输入调整仓库数据信息 返回提交结果
   */
  function Relocation(obj : any) {
    uni.hideLoading();
    const { code, msg } = obj;
    storeName.value = ''
    nums.value = ''
    storeId.value = ''
    remark.value = ''
    current.value = 0
    store.value.close()
    if (code === 1) {
      successToast(msg)
      setTimeout(() => {
        frinedList.value = []
        currentPage.value = 1
        init()
        shopDetail()
      }, 1000)
    } else {
      errorToast(msg)
    }
  }
</script>

<style scoped lang="less">
  .top {
    margin-top: 15rpx;
  }

  input {
    text-align: right;
  }

  .sure {
    width: 350rpx;
    height: 82rpx;
    background: linear-gradient(-77deg, #2C96F9, #1B91FF);
    border-radius: 10rpx;
    text-align: center;
    line-height: 82rpx;
    color: #fff;
    margin: 50rpx auto 15rpx;
  }

  // .title {
  // 	width: 100%;
  // 	overflow: hidden;
  // 	text-overflow: ellipsis;
  // 	white-space: nowrap;
  // }
</style>
<style>
  .top>>>.select-picker {
    justify-content: flex-end;
  }
</style>